import React from 'react';
import {
  Form,
  Modal,
} from 'antd';

import DescriptionList from '@/components/DescriptionList';

const { Description } = DescriptionList;
import { channel, repayStatus, repayMode } from '../../../common/options';
import * as options from '../../../common/options';

//查看详情
const DescView = Form.create()(props => {
  const { lookDescView, handleLookDesc, selectedRows } = props;
  return (
    <Modal
      width={700}
      destroyOnCloserepayModels
      title="查看还款详情"
      visible={lookDescView}
      onOk={() => handleLookDesc(false, [])}
      onCancel={() => handleLookDesc(false, [])}>
      {selectedRows ?
        <DescriptionList size="large" style={{ marginBottom: 32 }} col="2">
          <Description term="还款编号">{selectedRows.repaymentNo}</Description>
          <Description term="企业编号">{selectedRows.enterpriseNo}</Description>
          <Description term="企业名称">{selectedRows.enterpriseName}</Description>
          <Description term="项目编号">{selectedRows.projectNo}</Description>
          <Description term="项目名称">{selectedRows.projectName}</Description>
          <Description term="项目名称">{selectedRows.projectName}</Description>
          <Description term="融资方式">{selectedRows.financeMode === 1 ? '直借' : '保理'}</Description>
          <Description term="还款方式">{repayMode.map(item => (
            item.key === selectedRows.repayMode ? item.value : ''
          ))}</Description>
          <Description term="还款时间">{selectedRows.repayTime}</Description>
          <Description term="回款时间">{selectedRows.backTime}</Description>
          <Description term="账单金额">{selectedRows.amount}</Description>
          <Description term="应还本金">{selectedRows.principal}</Description>
          <Description term="应还利息">{selectedRows.interest}</Description>
          <Description term="服务费">{selectedRows.fee}</Description>
          <Description term="逾期利息">{selectedRows.overdueFee}</Description>
          <Description term="逾期服务费">{selectedRows.overdueServiceFee}</Description>
          <Description term="是否逾期">{selectedRows.overdueStatus === 1 ? '是' : '否'}</Description>
          <Description term="状态">{
            repayStatus.map(item => (
              item.key === selectedRows.status ? item.value : ''
            ))}</Description>
          <Description term="创建时间">{selectedRows.createTime}</Description>
          <Description term="代偿状态">{options.compensatoryStatus.map(item => (item.key === selectedRows.compensatoryStatus ? item.value : ''))}</Description>
          <Description term="凭证"><a href={selectedRows.voucher}>
            <img src={selectedRows.voucher} alt=""/>
          </a></Description>
        </DescriptionList>
        : ''}
    </Modal>
  );
});

export default DescView;
